<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>水资源监测</title>
    <link rel="stylesheet" type="text/css" href="../../lib/bootstrap/css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="../../css/gis.css" />
    <link rel="stylesheet" type="text/css" href="../../lib/layui/css/layui.css" />
    <style>
    html,
    body,
    #mapDiv {
        padding: 0;
        margin: 0;
        height: 100%;
    }

    .options-panel {
        font: 20px helvetica, sans-serif;
        background-color: #fff;
        position: absolute;
        right: 20px;
        top: 10px;
        padding: 10px;
        border: 1px solid #544F4F;
        z-index: 10000;
        text-align: center;
    }

    input[type="text"] {
        margin-bottom: 0;
    }

    li {
        line-height: 37px;
    }

    ul {
        margin: 0;
        list-style-type: none;
    }

    body .demo-class .layui-layer-content {
        background: #ffffff;
    }
    </style>
    <script type="text/javascript" src="../../js/jquery.min.js"></script>
    <script type="text/javascript" src="../../lib/layer/layer.js"></script>
    <!-- <script type="text/javascript" src="echarts/echarts.js"></script> -->
    <script type="text/javascript" src="../../lib/layui/layui.js"></script>
</head>

<body class="tundra">
    <div class="layui-side" style="background-color: #081832;">
        <div class="layui-side-scroll">
            <ul class="layui-nav layui-nav-tree">

                <li class="layui-nav-item layui-this" >
                    <a href="javascript:;" id="sub21" onclick="sub11click()">&nbsp&nbsp页面1.1</a>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;" id="sub22" onclick="sub12click()">&nbsp&nbsp页面1.1</a>
                </li>
            </ul>
        </div>
    </div>
    <div style="position: fixed; left: 200px; right: 0; height: 100%">
        <iframe id="subhtml" src="./siluan.html" frameborder="no" scrolling="yes" allowtransparency="true" width="100%" height="100%"></iframe>
    </div>
    <script type="text/javascript">
        layui.use('element', function() {
            var element = layui.element;
        });
        function sub11click() {
           document.getElementById("subhtml").src="./p11.html"
        };
        function sub12click() {
           document.getElementById("subhtml").src="./p12.html"
        };
        // function sub23click() {
        //    document.getElementById("subhtml").src="./lishi.html"
        // };
        // function sub24click() {
        //    document.getElementById("subhtml").src="./rivermonitor.html"
        // };
        // function sub25click() {
        //    document.getElementById("subhtml").src="./manyou.html"
        // };
    </script>
</body>

</html>